<template>
    <div style="margin: 10px 10px">
      <div style="margin-bottom: 10px">
        <el-input v-model="searchRecName" placeholder="请输入学生姓名" style="width: 150px;margin-right: 10px"></el-input>
        <el-button type="primary" @click="searchByName">搜索</el-button>
      </div>
      <div>
        <el-table
          :data="dailys"
          border
          style="width: 100%">
          <el-table-column
            fixed
            prop="daliyData"
            label="日期"
            width="150">
          </el-table-column>
          <el-table-column
            fixed
            prop="recruitStuName"
            label="学生姓名"
            width="150">
          </el-table-column>
          <el-table-column
            prop="daliyDetail"
            label="内容"
            width="900">
          </el-table-column>
          <el-table-column
            label="操作"
            width="100">
            <template slot-scope="scope">
              <el-button @click="handleDel(scope.row)" type="text" size="small">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination
          @current-change="currentChange"
          :current-page="currentPage"
          background
          :page-size="10"
          layout="prev, pager, next"
          :total="total">
        </el-pagination>
      </div>
    </div>
</template>

<script>
import { initDaily, getByName } from '../../../api/tea/daily'
import { del } from '../../../api/stu/daily'

export default {
  data() {
    return {
      currentPage: 1,
      total: 100,
      searchRecName: '',
      dailys: [{
        dailyId: 0,
        recruitStuName: '',
        daliyData: '2016-05-02',
        daliyDetail: '222222'
      }]
    }
  },
  methods: {
    // 通过学生姓名搜索
    searchByName() {
      if (this.searchRecName == ''){
        this.currentChange(this.currentPage)
      } else {
        getByName(this.searchRecName,this.currentPage).then(response=>{
          console.log(response)
          this.dailys = response.data.records
          this.total = response.data.total
        })
      }

    },
    // 删除日报
    handleDel(row) {
      this.$confirm('此操作将永久删除该信息, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        del(row.dailyId).then(response=>{
          this.$message({
            message:response.msg,
            type: 'success'
          })
          this.currentChange(this.currentPage)
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },
    // 当前页数据
    currentChange(page) {
      this.currentPage = page;
      initDaily(this.currentPage).then(response => {
        console.log(response)
        if (response.data == null){
          this.dailys = []
          this.total = 10
        } else {
          this.dailys = response.data.records
          this.total = response.data.total
        }
      })
    }
  },
  created() {
    this.currentChange(1)
  }
}
</script>

<style scoped>

</style>
